<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>  
  <style>
    *{
      padding:0;
      margin:0
    }
    .container {
      overflow: hidden;
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: row;
    }
  </style>
  <script src="https://cdn.bootcss.com/lodash.js/4.17.15/lodash.min.js"></script>
</head>
<body>
  <div class="container"></div>
</body>
  <script>
    var myVDTimeLine = VDTimeline.init({
      // 容器
      container:document.querySelector('.container'),
      // 数据
      data:[
        {name:'3.31',value:'2020-3-31'},
        {name:'4.1',value:'2020-4-01'},
        {name:'4.2',value:'2020-4-02'},
        {name:'4.3',value:'2020-4-03'},
        {name:'4.4',value:'2020-4-04'},
        {name:'4.5',value:'2020-4-05'},
        {name:'4.6',value:'2020-4-06'},
        {name:'4.7',value:'2020-4-07'},
        {name:'4.8',value:'2020-4-08'},
        {name:'4.9',value:'2020-4-09'},
        {name:'4.10',value:'2020-4-10'},
        {name:'4.11',value:'2020-4-11'},
        {name:'4.12',value:'2020-4-12'},
        {name:'4.13',value:'2020-4-13'},
      ],
      // 播放间隔
      interval: 2000,
      // 类目个数
      size: 10,
      // 快进/快退速度
      speed: 5,
      //自动播放
      autoPlay: false,
      // 是否显示播放按钮
      showPlayBtn: true,
      // 是否显示回到第一项按钮
      showStartBtn: true,
      // 是否显示回到最后一项按钮
      showEndBtn: true,
      // 是否显示快退按钮
      showBackBtn: true,
      // 是否显示快进按钮
      showForwardBtn: true,
      // 是否显示前一项按钮
      showNextBtn: true,
      // 是否显示后一项按钮
      showPrevBtn: true,
      // 播放
      play: callback,
      // 第一项
      toStart:callback,
      // 最后一项
      toEnd: function(data,index,start,end){
        callback(data,index,start,end)
      },
      // 快退 
      toBack: callback,
      // 快进
      toForward: callback,
      // 下一项
      toNext: callback,
      // 前一项
      toPrev: callback,

    })

    function callback(a,b,c,d){
      console.log(a,b,c,d)
    }

     myVDTimeLine.stop();
  </script>
</html>